<template>
	<body-wrap>
		<view class="tabBox">
			<!-- <view class="item" :class="{'selected':active==1}" @click="setTab(1)">在线咨询</view> -->
			<view class="item" :class="{'selected':active==62}" @click="setTab(62)">一对一语音</view>
			<view class="item" :class="{'selected':active==61}" @click="setTab(61)">线下咨询</view>
		</view>
		<view class="tabContent">
			<!-- <online-ask v-if="active==1"/>
			<voice-book v-if="active==62" :lists="lists || []"/>
			<offline-book v-else-if="active==61" :lists="lists || []"/> -->
			<consult-book-list :lists="lists || []" :type="active" @refresh="get_order_list"/>
			<empty v-if="lists && lists.length==0"/>
		</view>
	</body-wrap>
</template>

<script>
	import {defineComponent,reactive,toRefs,onMounted,getCurrentInstance,computed} from 'vue'
	import {onLoad,onShow} from '@dcloudio/uni-app'
	import { useStore } from 'vuex'
	import bodyWrap from "@/components/bodyWrap/index.vue"
	// import onlineAsk from "./components/onlineAsk.vue"
	// import voiceBook from "./components/voiceBook.vue"
	// import offlineBook from "./components/offlineBook.vue"
	import empty from "@/components/empty/index.vue"
	import consultBookList from "./components/consultBookList.vue"
	import {getOrderList,getTeacherOrderList} from "@/api/consult.js"
	import {toast} from "@/utils/common.js"
	export default defineComponent({
		components:{
			bodyWrap,
			// onlineAsk,
			// voiceBook,
			// offlineBook,
			consultBookList,
			empty
		},
		props:{
		
		},
		setup(props,context) {
			const store = useStore()
			const {proxy} = getCurrentInstance()
			
			const state = reactive({
				active:62,
				userInfo:computed(()=>store.state.base.userInfo),
				lists:'',
				pageIndex:1,
				pageSize:20
			})
			
			onMounted(()=>{
				get_order_list()
			})
			
			const get_order_list = ()=>{
				getTeacherOrderList({
					teacherId:state.userInfo._id,
					pageIndex:state.pageIndex,
					pageSize:state.pageSize,
					status:1,
					orderType:state.active
				}).then(res =>{
					if(res.code == 200){
						state.lists = res.data.data
					}else{
						toast('获取数据出错了！')
					}
				})
			}
			
			const setTab = (index)=>{
				state.active = index
				state.pageIndex = 1
				get_order_list()
			}
			
			return {
				...toRefs(state),
				setTab,
				get_order_list
			}
		}
	})
</script>

<style lang="scss" scoped>
	.tabBox{
		display: flex;
		background: #fff;
		.item{
			display: flex;
			flex: 1;
			align-items: center;
			justify-content: center;
			height: 90rpx;
			font-size: 30rpx;
			&.selected{
				color: #e3af2f;
				position: relative;
				z-index: 10;
				&:before{
					content: '';
					position: absolute;
					z-index: 11;
					width: 100%;
					left: 0;
					bottom: 0;
					height: 2px;
					background: #e3af2f;
				}
			}
		}
	}
</style>
